<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./wowjs文档/css/libs/animate.css" />
    <script src="./wowjs代码/wow.min.repeat.js"></script>
    <script src="js/wow.min.js"></script>
    <link rel="stylesheet" href="./css/bootstrap.min.css" />
    <link rel="stylesheet/less" href="./css/reset.less" />
    <link rel="stylesheet/less" href="./css/common.less" />
    <style>
      * {
        margin: 0;
        padding: 0;
      }
      .navbar-header a {
        margin-top: -8px !important;
      }
      img {
        display: block;
        width: 100%;
      }
      .navbar {
        margin-bottom: 0 !important;
      }
      .item-box1 {
        padding-top: 41px;
        margin-bottom: 87px;
        margin-top: 3vw;
      }
      .item-box1 .title {
        color: #ff6b08;
        font-size: 30px;
        margin-bottom: 39px;
      }
      .item-box1 .item-box1-box {
      }
      .item-box1 .item-box1-box .item {
      }
      .item-box1 .item-box1-box .item .news-item {
        position: relative;
        border: 1px solid #eeeeee;
        border-radius: 3px;
      }
      .item-box1 .item-box1-box .item .news-item .bg-text {
        padding: 14px 0;
        position: absolute;
        bottom: 0px;
        width: 100%;
        text-align: center;
        background-color: rgba(0, 0, 0, 0.4);
        color: white;
      }
      .item-box2 {
        margin-bottom: 32px;
      }
      .item-box2 > .container {
        padding-bottom: 32px;
        border-bottom: 1px dashed #d4d4d4;
      }
      .item-box2 .item {
        margin-bottom: 60px;
      }
      .item-box2 .item .left {
      }
      .item-box2 .item .left .image {
        background-color: #fefefb;
        border: 1px solid #dddddd;
        border-radius: 3px;
        padding: 4px;
      }
      .item-box2 .item .right {
      }
      .item-box2 .item .right .title {
        font-size: 18px;
      }
      .item-box2 .item .right .date {
        font-size: 12px;
        margin-top: 17px;
        margin-bottom: 24px;
      }
      .item-box2 .item .right .desc {
        font-size: 14px;
        margin-bottom: 16px;
      }
      .item-box2 .item .right .select-btn {
        color: #ff6900;
        width: 96px;
        height: 30px;
        text-align: center;
        border-radius: 13px;
        border: 1px solid #ff6900;

        line-height: 32px;
        margin-left: auto;
      }
      .item-box2 .item:hover .title {
        color: #ff6900;
      }
      .item-box2 .item:hover .right .select-btn {
        background-color: #ff6900;
        color: white;
      }
      .pagess {
        height: 34px;
        margin-bottom: 25px !important;
      }
      .pagination {
        display: block;
        width: 19%;
        margin: 0 auto;
      }

      /* 底部导航 */
      .footer-bgcolor {
        background-color: #3b3b3b;
      }
      .footer {
        margin: 35px 0 37px;
      }
      .footer .left {
        font-size: 14px;
        color: #a1a3ab;
      }
      .footer .left .nav-title {
        margin-bottom: 15px;
      }
      .footer .left .copy {
        font-size: 11px;
      }
      .footer .right {
        display: flex;
        justify-content: space-evenly;
      }

      .footer .right .item:nth-child(1) {
        width: 38px;
        height: 38px;
        background: url(./images/footer-icon01.png) no-repeat 0px 0px;
        background-size: cover;
      }
      .footer .right .item:nth-child(3) {
        width: 38px;
        height: 38px;
        background: url(./images/footer-icon03.png) no-repeat 0px 0px;
        background-size: cover;
      }
      .footer .right .item:nth-child(2) {
        position: relative;
        width: 38px;
        height: 38px;
        background: url(./images/footer-icon02.png) no-repeat 0px 0px;
        background-size: cover;
      }
      .footer .right .item:nth-child(2) > .qr-code {
        position: absolute;
        top: -150px;
        left: -50px;
        width: 142px;
        height: 150px;
        background: url(./images/footer-QR.png) no-repeat 0px 0px;
        background-size: cover;
        display: none;
      }
      .footer .right .item:nth-child(2):hover .qr-code {
        display: block;
      }

      @media ((max-width: 1680px)) {
        .pagination {
          width: 40%;
        }
      }
      @media ((max-width: 992px)) {
        .pagination {
          width: 45%;
        }
        .footer .left {
          text-align: center;
          margin-bottom: 30px;
        }
      }
      @media ((max-width: 768px)) {
        .pagination {
          width: 90%;
        }
      }
    </style>
  </head>
  <body>
    <!-- 导航栏开始 -->
    <nav class="navbar navbar-inverse">
      <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button
            type="button"
            class="navbar-toggle collapsed"
            data-toggle="collapse"
            data-target="#bs-example-navbar-collapse-1"
            aria-expanded="false"
          >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#"
            ><img src="./images/logo.png" alt=""
          /></a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav">
            <li class="">
              <a href="./首页.html">首页</a>
            </li>
            <li><a href="./家族.html">Laya家族</a></li>
            <li><a href="./游戏.html">游戏</a></li>
            <li><a href="./新闻动态.html">新闻动态</a></li>
            <li><a href="#">开发者中心</a></li>
            <li><a href="#">开发者社区</a></li>
            <li><a href="#">开放平台</a></li>
            <li><a href="./关于我们.html">关于我们</a></li>
          </ul>

          <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
              <a
                href="#"
                class="dropdown-toggle"
                data-toggle="dropdown"
                role="button"
                aria-haspopup="true"
                aria-expanded="false"
                >Language <span class="caret"></span
              ></a>
              <ul class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
              </ul>
            </li>
          </ul>
        </div>
        <!-- /.navbar-collapse -->
      </div>
      <!-- /.container-fluid -->
    </nav>
    <!-- 导航栏结束 -->
    <div class="item-box1">
      <div class="container">
        <div class="title wow bounceInDown" data-wow-delay="0.5">新闻动态</div>
        <div class="item-box1-box row wow flipInY" data-wow-delay="0.7s">
          <div class="item col-lg-4 col-md-4 col-sm-12 col-xs-12">
            <div class="news-item">
              <div class="bg-text">技术突破：HTML5裸跑性能已可媲美APP</div>
              <img src="./images4/news01.png" alt="" />
            </div>
          </div>
          <div
            class="item col-lg-4 col-md-4 col-sm-12 col-xs-12 wow flipInY"
            data-wow-delay="0.9s"
          >
            <div class="news-item">
              <div class="bg-text">HTML5干货：LAYAWORLD TFC秋季特刊</div>
              <img src="./images4/news02.png" alt="" />
            </div>
          </div>
          <div
            class="item col-lg-4 col-md-4 col-sm-12 col-xs-12 wow flipInY"
            data-wow-delay="1.1s"
          >
            <div class="news-item">
              <div class="bg-text">慕和：手游大作《魔卡幻想》为何移植HTML5</div>
              <img src="./images4/news03.png" alt="" />
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="item-box2 wow bounceInUp" data-wow-delay="0.5s">
      <div class="container">
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list01.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">技术突破：HTML5裸跑性能已可媲美APP</div>
            <div class="date">2016-02-25</div>
            <div class="desc">
              Layabox计划在3月限量内测的LayaAir引擎，通过在低端机型上的性能实测以及即将上线的大型裸跑游戏，证明了
              HTML5裸跑性能已可媲美APP，性能问题将不再成为制约产业发展的瓶颈。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list02.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">Layabox吹响进军台湾HTML5市场的号角</div>
            <div class="date">2016-01-29</div>
            <div class="desc">
              以本届HTML5游戏峰会为契机，Layabox携多款优质大型HTML5手游吹响了进军台湾的号角，与此同时，Layabox与
              台湾游戏产业同行就游戏开发、游戏发行、平台合作等业务启动了合作的筹备阶段。猴年春节后，将会有多款大型
              HTML5手游直接登陆台湾游戏市场。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list03.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">
              微信“应用号”后，Layabox与火速移动结盟力推HTML5应用
            </div>
            <div class="date">2016-01-15</div>
            <div class="desc">
              HTML5商业引擎提供商Layabox与HTML5应用发行商火速移动（Huosumobi），于2016年1月13日正式宣布双方结
              成全面战略合作联盟。未来从HTML5应用的市场推广、引擎技术、平台、运营、分发等HTML5应用领域的生态进行
              全方位合作。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list04.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">谢成鸿：HTML5引擎将向全行业引擎领域发展</div>
            <div class="date">2016-01-12</div>
            <div class="desc">
              Layabox总裁谢成鸿讲解了HTML5游戏引擎的现状和未来的发展，认为HTML5的性能突破将淘汰单个行业领域的全
              能引擎，向全行业引擎领域发展，HTML5的3D引擎时代也会提前到来。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list05.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">Layabox荣膺“2015年度最佳引擎奖”</div>
            <div class="date">2016-01-07</div>
            <div class="desc">
              HTML5梦工场举办的”娜喊杯”2015
              HTML5年度颁奖盛典于2016年1月7日在北京古北水镇成功举行。Layabox凭借
              2015年唯一拥有大型HTML5游戏线上产品的商业引擎供应商优势，荣膺“2015年度最佳引擎奖”。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list06.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">Layabox本月将上线四款大型HTML5游戏</div>
            <div class="date">2015-12-10</div>
            <div class="desc">
              Layabox一直致力于大型HTML5引擎技术研发和CP培育，从本月开始，将不断推出大型HTML5游戏，我们希望用自
              己的努力，提升玩家和渠道对HTML5游戏品质以及盈利能力的信心，推动产业的发展和升级。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list07.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">关于HTML5游戏跨界合作的几个切入点！</div>
            <div class="date">2015-12-02</div>
            <div class="desc">
              要想在当前阶段先跳出来成为瞩目的明星企业。一是制作高品质游戏，兼顾APP与H5市场；二是要深度结合H5技术
              的无需下载、即点即玩、易传播、跨平台、应用领域广泛等属性
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list08.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">HTML5行业首次出席中日韩政府级开源论坛</div>
            <div class="date">2015-11-26</div>
            <div class="desc">
              第十四届东北亚开源软件推进论坛在日本东京举行,本次会议由中日韩三国行业主管部门组织。这是HTML5行业代表
              首次出市出席东北亚开源软件推进论坛。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
        <div class="item row">
          <div class="left col-lg-3 col-md-3 col-sm-12 col-xs-12">
            <div class="image">
              <img src="./images4/list09.png" alt="" />
            </div>
          </div>
          <div class="right col-lg-9 col-md-9 col-sm-12 col-xs-12">
            <div class="title">Layabox引擎用HTML5还原3D端游</div>
            <div class="date">2015-11-23</div>
            <div class="desc">
              老牌游戏研发商中娱正在用Layabox引擎将著名3D
              端游《猎刃》还原到HTML5场景中，Layabox有望成为首个拥有
              重度3D游戏产品案例的HTML5游戏引擎。
            </div>
            <div class="select-btn">查看详情</div>
          </div>
        </div>
      </div>
    </div>
    <div class="pagess wow bounceIn" data-wow-delay="1s">
      <nav aria-label="Page navigation">
        <ul class="pagination">
          <li>
            <a href="#">36条</a>
          </li>
          <li>
            <a href="#" aria-label="Previous">
              <span aria-hidden="true">上一页</span>
            </a>
          </li>
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
          <li>
            <a href="#" aria-label="Next">
              <span aria-hidden="true">下一页</span>
            </a>
          </li>
        </ul>
      </nav>
    </div>
    <div class="footer-bgcolor">
      <div class="container">
        <div class="footer row">
          <div class="left col-lg-9 col-md-9 col-md-12 col-xs-12">
            <div class="nav-title">公司简介 联系方式 人才招聘</div>
            <div class="copy">
              All Copyright Reserved by Layabox Inc. 京ICP备15008163号-1
            </div>
          </div>
          <div class="right col-lg-3 col-md-3 col-md-12 col-xs-12">
            <div class="item"></div>
            <div class="item">
              <div class="qr-code"></div>
            </div>
            <div class="item"></div>
          </div>
        </div>
      </div>
    </div>
  </body>
  <script src="./js/jquery-3.7.1.min.js"></script>
  <script src="./js/bootstrap.min.js"></script>
  <script src="./js/less.min.js"></script>
  <script>
    new WOW().init();
  </script>
</html>
